<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"> 

<ui:composition template="/WEB-INF/templates/BasicTemplate.xhtml">
    <ui:define name="content">
	    <p:layout fullPage="true" id="layout">
		    <p:layoutUnit position="west" header="Menu" collapsible="false">
		    	<h:form>
		    		<p:menu model="#{loginUsuarioBean.model}" />
		    	</h:form>
		    </p:layoutUnit>
			<p:layoutUnit position="east" header="Bienvenido #{loginUsuarioBean.persona.nombre}" collapsible="false">
				<h:form>
					<p:separator />
					<p:commandButton value="Logout" action="#{loginUsuarioBean.logoutUser}"></p:commandButton>
					<p:separator />
					<p:commandButton value="Modificar perfil" action="#{loginUsuarioBean.modificarUsuarioBoton}"></p:commandButton>
				</h:form>
				<p:graphicImage style="width:70%; position:absolute; left:15%; top:70%;" library="images" name="LogoSemiTrans.jpg" />
			</p:layoutUnit>
		    <p:layoutUnit position="center">
		    <h:form>
		    <p:panelGrid id="crearProyecto" columns="3" style="width: 70%;margin: 0 auto; ">
		    <p:outputLabel value="Perfil"/>
		    <p:selectOneMenu id="metodos" value="#{perfilBean.perfil}" style="width: 200px;">
							<f:selectItems value="#{perfilBean.perfiles}"/>
						</p:selectOneMenu>
			<p:commandButton value="Ver" action="#{perfilBean.refrescar}"></p:commandButton>
		    </p:panelGrid>
		    
		    </h:form>
		        <form style="width: 70%;margin: 0 auto; ">			
					 <p:panelGrid id="panel" columns="2">
					<p:dataTable id="tabla1" value="#{perfilBean.funcionalidadesDisponibles}"  var="lis" emptyMessage="" style="width: 100%; ">
						<p:column>
		              <f:facet name="header">
		                DISPONIBLES
		              </f:facet>
		              <h:outputText value="#{lis}"/>
		            </p:column>
		            <p:column>
		              <f:facet name="header">
		              <h:outputText/>
		             </f:facet>
		              <p:commandButton action="#{perfilBean.agregar}" value="Agregar" update=":panel" >
		              <f:setPropertyActionListener target="#{perfilBean.funcionalidadDisponible}" value="#{lis}"></f:setPropertyActionListener>
		              </p:commandButton>
		            </p:column>
					</p:dataTable>
	
					<p:dataTable id="tabla2" value="#{perfilBean.funcionalidadesActuales}" var="lis1" emptyMessage="" style="width: 100%; ">
					<p:column>
		              <f:facet name="header">
		                ACTUALES
		              </f:facet>
		              <h:outputText value="#{lis1}"/>
		            </p:column>
		            <p:column>
		             <f:facet name="header">
		              <h:outputText/>
		             </f:facet>
		              <p:commandButton action="#{perfilBean.quitar}" value="Quitar" update=":panel">
		              <f:setPropertyActionListener target="#{perfilBean.funcionalidadDisponible}" value="#{lis1}"></f:setPropertyActionListener>
		              </p:commandButton>
		            </p:column>
					</p:dataTable>
					</p:panelGrid>
		            <h:commandButton value="Cerrar" action="#{gerenteNegocioBean.cerrar}"/>
		        	
		        </form>
			</p:layoutUnit>
		</p:layout>
    </ui:define>
</ui:composition>
</html>
